<html lang="en">
{% include 'navbar.html' %}
<head>
    <style>
        body {
            font-family: "Segoe UI";
            background: rgb(237, 238, 239);
        {#background: linear-gradient(0deg, rgba(44, 255, 210, 0.92) 0%, rgba(69, 165, 195, 0.92) 55%) no-repeat fixed;#}
        }

        .login_form {

            border-radius: 25pt;
            background-color: rgba(255, 255, 255, 0.6);
            padding: 12pt 15pt 20pt;

        }

        .col-md-6 {
            margin-left: auto;
            margin-right: auto;
            padding: 15pt;
        }

        .container {
            margin-left: auto;
            margin-right: auto;
        }
    </style>
    <title>Title</title>
</head>
<body>
{% csrf_token %}
{% block navbar %}
{% endblock %}
<div class="container">
    <div class="row justify-content-center">
        <div id="to_left">
            <h1 class="mt-2" style="color: rgb(54,151,212)">Login to our system</h1>
            <hr class="mt-0 mb-4">

        </div>
    </div>
</div>
<div class="col-md-6">
    <form class="login_form">
        {% csrf_token %}
        <div class="form-group">
            <label style="color: black" for="username">Username</label>
            <input type="username" class="form-control" id="username" aria-describedby="emailHelp"
                   placeholder="Enter username" name="username">
            <small style="color: black" id="emailHelp" class="form-text">We'll never share your email with anyone
                else.</small>
        </div>
        <div class="form-group">
            <label style="color: black" for="password">Password</label>
            <input type="password" class="form-control" id="password" placeholder="Password" name="password">
            <a href="/account/register">To register click here</a>
            {% if msg %}
                <p class="text-danger">{{ msg }}</p>
            {% endif %}
        </div>
        <button type="submit" class="btn btn-light" formmethod="post" formaction="#">Log in</button>
    </form>
</div>
</body>
</html>